﻿// https://github.com/whvcse/treetable-lay
layui.config({
    base: LAYUI_EXT + "/"
}).use(['treeTable', 'eleTree'], function () {
    var treeTable = layui.treeTable;
    var data = [{
        id: '1',
        name: 'xxx',
        createTime: '2019/11/18 10:44:00',
    },
        {
            pid: '1',
            id: '1_1',
            name: 'xxx',
            createTime: '2019/11/18 10:44:00'
        }, {
            id: '2',
            name: 'xxx',
            createTime: '2019/11/18 10:44:00',
        }, {
            pid: '2',
            id: '2_1',
            name: 'xxx',
            createTime: '2019/11/18 10:44:00'
        }];

// 渲染表格
    var insTb = treeTable.render({
        elem: '#demoTreeTb',
        // data: data,  // 数据
        // toolbar:'#toolbarDemo',
        // toolbar:'default',
        defaultToolbar: ['filter', 'print', 'exports'],
        tree: {
            iconIndex: 1,    // 折叠图标显示在第几列
            isPidData: true,  // 是否是pid形式数据
            idName: 'menuId',  // id字段名称
            pidName: 'parentId'     // pid字段名称
        },
        cols: [[
            {type: 'numbers'},
            {field: 'menuName', title: '菜单名称'},
            {field: 'url', title: '访问路径'},
            {field: 'sort', title: '序号'},
            {field: 'createDate', title: '创建时间'},
            {field: 'status', title: '状态'}
        ]],
        reqData: function (data, callback) {
            // 在这里写ajax请求，通过callback方法回调数据
            layui.$.get(CTX + '/menu/find', function (res) {
                if (res.code === 0) {
                    callback(res.data);
                } else {
                    callback(res.msg);
                }
            });
        }
    });
    // 头部工具栏点击事件
    treeTable.on('toolbar(demoTreeTb)', function (obj) {
        console.log(obj)
        switch (obj.event) {
            case 'add':
                layer.msg('添加');
                break;
            case 'delete':
                layer.msg('删除');
                break;
            case 'update':
                layer.msg('编辑');
                break;
            case 'LAYTABLE_TIPS':
                layer.msg('提示');
                break;
        }
    });
    var eleTree = layui.eleTree;
    var el5;
    layui.$("[name='parentMenuName']").on("click",function (e) {
        e.stopPropagation();
        if(!el5){
            el5=eleTree.render({
                elem: '.ele5',
                // data: data,
                url:CTX+'/menu/tree/list',
                request: {
                    name: "menuName",
                    key: "menuId",
                    children: "children",
                    checked: "checked",
                    disabled: "disabled",
                    isLeaf: "isLeaf"
                },
                response: {
                    statusName: "code",
                    statusCode: 0,
                    dataName: "data"
                },
                defaultExpandAll: true,
                expandOnClickNode: false,
                highlightCurrent: true
            });
        }
        layui.$(".ele5").toggle();
    })
    eleTree.on("nodeClick(data5)",function(d) {
        layui.$("[name='parentMenuName']").val(d.data.currentData.menuName)
        layui.$("[name='parentId']").val(d.data.currentData.menuId)
        layui.$(".ele5").hide();
    })

    layui.$('#addBtn').click(function (e) {
        var index = layer.open({
            type: 1,
            title: '新增',
            area: ['360px', '500px'],
            content: layui.$('#form') //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
        });
        var form = layui.form;
        form.on('submit(submitBtn)', function (data) {
            layui.$.ajax({
                type: 'post',
                cache: false,
                dataType: 'json',
                url: CTX + '/menu/add2',
                data: data.field,
                // url:CTX+'/menu/add1',
                // contentType :"application/json",
                // data:JSON.stringify(data.field),
                success: function (res) {
                    console.log(res)
                    if (res.code === 0) {
                        layer.close(index)
                        insTb.reload();

                    } else {
                        layer.msg(res.msg);
                    }
                },
                error: function (err) {
                    console.log(err)
                }
            });
            return false;
        });
    });
});
